<!--
* 开源版本请务必保留此注释头信息，若删除捷码开源〔GEMOS〕官方保留所有法律责任追究！
* 本软件受国家版权局知识产权以及国家计算机软件著作权保护（登记号：2018SR503328）
* 不得恶意分享产品源代码、二次转售等，违者必究。
* Copyright (c) 2020 gemframework all rights reserved.
* http://www.gemframework.com
* 版权所有，侵权必究！
-->
<!DOCTYPE html>
<html lang="zh-cn" class="fullscreen-bg" xmlns:th="http://www.thymeleaf.org">
<head th:replace="common/links :: common_header(~{::title},~{::link},~{})">
    <title>请您登录 | GemFrame开源权限管理系统v1.0.10</title>
    <link th:href="@{/assets/css/login.css}" rel="stylesheet">
    <script>
        if (window != top) {
            top.location.replace(location.href);
        }
    </script>
</head>
<body>
<div class="login-wrapper">
    <div class="login-header">
        <img th:src="@{/coral/images/logo.png}">
        CORAL开源权限管理系统
    </div>
    <div class="login-body">
        <div class="layui-card">
            <div class="layui-card-header">
                <i class="layui-icon layui-icon-group"></i>&nbsp;&nbsp;用户登录
            </div>
            <form class="layui-card-body layui-form layui-form-pane">
                <div class="layui-form-item">
                    <label class="layui-form-label"><i class="layui-icon layui-icon-username"></i></label>
                    <div class="layui-input-block">
                        <input name="username" type="text" placeholder="账号" class="layui-input"
                               lay-verType="tips" lay-verify="required" required value="admin"/>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><i class="layui-icon layui-icon-password"></i></label>
                    <div class="layui-input-block">
                        <input name="password" type="password" placeholder="密码" class="layui-input"
                               lay-verType="tips" lay-verify="required" required value="123456"/>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label"><i class="layui-icon layui-icon-vercode"></i></label>
                    <div class="layui-input-block">
                        <div class="layui-row inline-block">
                            <div class="layui-col-xs7">
                                <input id="validCode" name="validCode" type="text" placeholder="验证码" class="layui-input"
                                       autocomplete="off" lay-verType="tips" lay-verify="required" required/>
                            </div>
                            <div class="layui-col-xs5" style="padding-left: 6px;">
                                <img class="login-captcha" src="captcha/code">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <a href="javascript:;" class="layui-link">帐号注册</a>
                    <a href="javascript:;" class="layui-link pull-right">忘记密码？</a>
                </div>
                <div class="layui-form-item">
                    <button lay-filter="login-submit" class="layui-btn layui-btn-fluid" lay-submit>登 录</button>
                </div>
                <div class="layui-form-item login-other">
                    <label>第三方登录</label>
                    <a href="javascript:;"><i class="layui-icon layui-icon-login-qq"></i></a>
                    <a href="javascript:;"><i class="layui-icon layui-icon-login-wechat"></i></a>
                    <a href="javascript:;"><i class="layui-icon layui-icon-login-weibo"></i></a>
                </div>
            </form>
        </div>
    </div>

    <div class="login-footer">
        <p>Copyright © [[${#dates.format(new java.util.Date().getTime(), 'yyyy')}]] gemframework.com 版权所有</p>
        <p>
            <span><a href="http://www.gemframework.com" target="_blank">项目官网</a></span>
            | <span><a href="http://www.gemframework.com/bbs" target="_blank">社区交流</a></span>
            | <span><a href="https://gitee.com/gemteam" target="_blank">源码获取</a></span>
            | <span><a href="login.html">界面1️⃣</a></span>
            | <span><a href="login_oschina.html">仿开源中国</a></span>
            | <span><a href="login_gitee.html">仿码云界面</a></span>
        </p>
    </div>
</div>

<!-- js部分 -->
<div th:replace="common/scripts :: common"></div>
<div th:replace="common/scripts :: jquery"></div>
<script>
    layui.use(['layer', 'form','notice'], function () {
        var $ = layui.jquery;
        var layer = layui.layer;
        var form = layui.form;
        var notice = layui.notice;

        //登录超时处理
        if (top.location.href != self.location.href) {
            layer.alert("登录超时，请重新登录！", {
                closeBtn: 0
                , icon: 5
                , anim: 4 //动画类型
            }, function () {
                top.location.href = self.location.href;
            });
        }

        // 表单提交
        form.on('submit(login-submit)', function (obj) {
            obj.field.password = window.btoa(obj.field.password);
            $.ajax({
                type: "post",
                url: "login",
                data: obj.field,
                async:true, // 异步请求
                cache:false, // 设置为 false 将不缓存此页面
                dataType: "json", // 返回对象
                // contentType:"application/json;charset=UTF-8",
                success: function(res) {
                    if (res.code == "0") {
                        layer.msg('登录成功', {icon: 1, time: 1500}, function () {
                            location.replace('index')
                        });
                    }else {
                        $(".login-captcha").click();
                        notice.error({
                            title: '登录失败',
                            message: "错误码：["+res.code+"] 错误消息["+res.msg+"]",
                            theme: "light",
                            displayMode: 2,
                            layout:2
                        });
                    }
                },
                error: function(e) {
                    // 请求失败函数
                    console.log("error:"+JSON.stringify(e));
                    layer.msg("操作失败，请检查是否有相关操作权限！");
                }
            })
            return false;
        });

        // 图形验证码
        $('.login-captcha').click(function () {
            this.src = this.src + '?t=' + (new Date).getTime();
        });
        $("#validCode").click(function(){
            $(".login-captcha").click()
        })
    });
</script>
</body>
</html>